<template>
  <el-dialog class="relationOpne" top="15vh" :visible.sync="visible" title="选择投顾" @close="closeHandle" :close-on-click-modal="false" append-to-body :modal="true" :close-on-press-escape="false">
    <el-form ref="dataForm" :inline="true" label-width="80px" :model="dataForm">
      <el-form-item label="投顾名称" prop="adviserName">
        <el-input v-model="dataForm.adviserName" size="small" clearable placeholder="请输入投顾名称" style="width: 220px;"></el-input>
      </el-form-item>
      <el-form-item style="margin-left: 20px">
        <el-button class="bg-green" size="small" @click="getList">查询</el-button>
        <!-- <el-button @click="resetForm">重置</el-button> -->
      </el-form-item>
    </el-form>
    <el-table
      v-loading="listLoading"
      :data="list"
      border fit
      size="mini"
      @row-click="submitHandle"
      :header-cell-style="{background:'#dcedff',color:'#32639d'}"
      style="width: 100%;"
    >
      <el-table-column type="index" label="序号" align="center" width="60"></el-table-column>
      <el-table-column prop="investName" label="投顾名称" width="160" align="center"></el-table-column>
      <el-table-column prop="investContacts" label="联系人" width="120" align="center"></el-table-column>
      <el-table-column prop="investMobile" label="手机号码" width="130" align="center"></el-table-column>
      <!-- <el-table-column prop="investWechat" label="微信号" width="160" align="center"></el-table-column>
      <el-table-column prop="investEmail" label="邮箱" width="180" align="center"></el-table-column> -->
      <el-table-column prop="investCommittime" label="成立日期" width="180" align="center">
        <template slot-scope="{row}">
          <span v-if="row.investCommittime">{{ row.investCommittime | parseTime }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="investChannel" label="渠道来源" show-overflow-tooltip></el-table-column>
    </el-table>
    <pagination v-show="total>0" :total="total" :page.sync="listQuery.pageCurrent" :limit.sync="listQuery.limit" @pagination="getList" />
  </el-dialog>
</template>

<script>
import { mapGetters } from 'vuex'
import { fetchList } from '@/api/investManage'
import Pagination from '@/components/Pagination'

export default {
  components: { Pagination },
  data() {
    return {
      visible: false,
      total: 0,
      listLoading: false,
      dataForm: {},
      listQuery: {
        pageCurrent: 1,
        limit: 10
      },
      list: [],
    }
  },
  computed: {
    ...mapGetters(['userId'])
  },
  methods: {
    // 初始化
    init() {
      this.visible = true
      this.listQuery = {
        pageCurrent: 1,
        limit: 10
      }
      this.dataForm = {}
      this.$nextTick(() => {
        this.getList()
      })
    },
    closeHandle() {
      this.visible = false
    },
    handleUpdate() {},
    resetForm() {
      this.$refs.dataForm.resetFields()
      this.getList()
    },
    getList() {
      this.listLoading = true
      fetchList({
        userId: this.userId,
        ...this.dataForm,
        ...this.listQuery
      }).then(res => {
        this.listLoading = false
        console.log('投顾管理', res)
        this.list = res.body.list
        this.total = res.body.total
      })
    },
    submitHandle(row) {
      this.$emit('selctInvestManage', row.investName)
      this.visible = false
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-dialog__body {
  padding-bottom: 0;
}
</style>


